<template>
  <a-input
    :class="[disable ? 'arco-input-disabled' : '']"
    :model-value="modelValue"
    :allow-clear="false"
    placeholder="请选择"
    style="cursor: pointer"
    readonly
  >
    <template #suffix>
      <span
        class="arco-icon-hover arco-input-icon-hover arco-input-clear-btn"
        style="margin-right: 10px"
        v-if="!formDisabled && modelValue"
      >
        <icon-close @click.stop="emit('clear')" />
      </span>
      <icon-right />
    </template>
  </a-input>
</template>

<script setup>
  import { inject } from 'vue'
  const emit = defineEmits('clear')
  const formDisabled = inject('formDisabled')

  defineProps({
    modelValue: String,
    disable: Boolean,
  })
</script>
